<template>
  <div class="compo-headerWithClose flex">
    <div class="dialog-title flex-1">{{ title }}</div>
    <div class="dialog-close" can-click-trigger title="关闭">
      <div class="box-trigger hv-center">
        <IconX @click="onClose" :size="16" stroke="2" color="#323335" />
      </div>
    </div>
  </div>
</template>
<script setup>
import { IconX } from "@tabler/icons-vue";

const props = defineProps({
  title: String, //标题
});

const emits = defineEmits(["close"]);

const onClose = () => {
  emits("close");
};
</script>
<style lang="scss">
.compo-headerWithClose {
  color: #323335;
  font-family: "PingFang SC";
  font-size: 14px;
  font-style: normal;
  font-weight: 500;
  line-height: 22px;
}
</style>
